import * as React from 'react';
import styles from '@patternfly/react-styles/css/{{typeDir}}/{{componentName}}';
import { css } from '@patternfly/react-styles';

interface {{ componentName }}Props extends React.HTMLProps<HTMLDivElement> {
  /** Content rendered inside {{ componentName }} */
  children?: React.ReactNode;
  /** Class to add to outer div */
  className?: string;
}

export const {{componentName}}: React.FunctionComponent<{{componentName}}Props> = ({
  className,
  children,
  ...props
}: {{ componentName }}Props) => {
  return (
    <div className={css(styles.{{ camelCase componentName }}, className)} {...props}>
      {children}
    </div>
  );
}
{{componentName}}.displayName = '{{componentName}}';

